<template>

  <div>
<el-form :model="ruleForm" :rules="rules" :inline="true" ref="ruleForm" label-width="180px" class="demo-ruleForm">
  <el-form-item label="学校标识码" prop="schoolcode">
    <el-input v-model="ruleForm.schoolcode"></el-input>
  </el-form-item>
  <el-form-item label="学校名称" prop="schoolname">
    <el-input v-model="ruleForm.schoolname"></el-input>
  </el-form-item>
  <el-form-item label="学校地址名称" prop="schoollocationname">
    <el-input v-model="ruleForm.schoollocationname"></el-input>
  </el-form-item>
  <el-form-item label="学校地址代码" prop="schoollocationcode">
    <el-input v-model="ruleForm.schoollocationcode"></el-input>
  </el-form-item>
<!--  <el-form-item label="学校驻地城乡类型代码" prop="schoollocationtypecode">-->
<!--    <el-input v-model="ruleForm.schoollocationtypecode" @blur="AlertLTN" @input="getLTN"></el-input>-->
<!--  </el-form-item>-->
<!--  <el-form-item label="学校驻地城乡类型代码" prop="schoollocationtypename">-->
<!--    <el-input v-model="ruleForm.schoollocationtypename" readonly></el-input>-->
<!--  </el-form-item>-->
  <el-form-item label="学校驻地城乡类型代码">
    <el-select v-model="locationtypevalue" placeholder="请选择要搜索的字段" @change="getLocationTypeName">
      <el-option
          v-for="item in locationtypeoptions"
          :key="item.value"
          :label="item.label"
          :value="item.value">
      </el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="学校驻地城乡类型名称" prop="schoollocationtypename">
    <el-input v-model="ruleForm.schoollocationtypename" readonly></el-input>
  </el-form-item>
<!--  <el-form-item label="学校办学类型代码" prop="schooltypecode">-->
<!--    <el-input v-model="ruleForm.schooltypecode" @input="getTN" @blur="AlertTN"></el-input>-->
<!--  </el-form-item>-->
<!--  <el-form-item label="学校办学类型名称" prop="schooltypename" >-->
<!--    <el-input v-model="ruleForm.schooltypename" readonly></el-input>-->
<!--  </el-form-item>-->
  <el-form-item label="学校办学类型代码">
    <el-select v-model="typevalue" placeholder="请选择要搜索的字段" @change="getTypeName">
      <el-option
          v-for="item in typeoptions"
          :key="item.value"
          :label="item.label"
          :value="item.value">
      </el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="学校办学类型名称" prop="schooltypename">
    <el-input v-model="ruleForm.schooltypename" readonly></el-input>
  </el-form-item>
<!--  <el-form-item label="学校举办者代码" prop="schoolhostcode">-->
<!--    <el-input v-model="ruleForm.schoolhostcode" @input="getHN" @blur="AlertHN"></el-input>-->
<!--  </el-form-item>-->
<!--  <el-form-item label="学校举办者名称" prop="schoolhostname">-->
<!--    <el-input v-model="ruleForm.schoolhostname" readonly></el-input>-->
<!--  </el-form-item>-->
  <el-form-item label="学校举办者代码">
    <el-select v-model="hostvalue" placeholder="请选择要搜索的字段" @change="getHostName">
      <el-option
          v-for="item in hostoptions"
          :key="item.value"
          :label="item.label"
          :value="item.value">
      </el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="学校举办者名称" prop="schoolhostname">
    <el-input v-model="ruleForm.schoolhostname" readonly></el-input>
  </el-form-item>

  <el-form-item>
    <el-button type="primary" @click="submitForm('ruleForm')">立即添加</el-button>
    <el-button @click="resetForm('ruleForm')">重置</el-button>
  </el-form-item>
</el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      ruleForm: {
        schoolcode: '',
        schoolname: '',
        schoollocationname: '',
        schoollocationcode: '',
        schoollocationtypecode: '',
        schoollocationtypename: '',
        schooltypecode: '',
        schooltypename: '',
        schoolhostcode: '',
        schoolhostname:''
      },
      rules: {
        id: [
          { required: true, message: '请填写编号 注意与已存在的编号不要重复', trigger: 'blur' }
        ],
        schoolcode: [
          { required: true, message: '请填写学校标识码，没有则填无', trigger: 'blur' }
        ],
        schoolname: [
          { required: true, message: '学校名称不可更改,若学校名称更改，请重新添加', trigger:'blur' }
        ],
        schoollocationname: [
          { required: true, message: '请填写学校地址名称，没有则填无', trigger: 'change' }
        ],
        schoollocationcode: [
          { required: true, message: '请填写学校地址代码，没有则填无', trigger: 'change' }
        ],
        schoollocationtypecode: [
          { required: true, message: '请填写学校驻地城乡类型，没有则填无', trigger: 'change' }
        ],
        schoollocationtypename: [
          { required: true, message: '请在左侧选择学校驻地城乡类型', trigger: 'change' }
        ],
        schooltypecode: [
          { required: true, message: '请填写学校办学类型，没有则填无', trigger: 'change' }
        ],
        schooltypename: [
          { required: true, message: '请在左侧选择学校办学类型代码', trigger: 'change' }
        ],
        schoolhostcode: [
          { required: true, message: '请填写学校举办者代码，没有则填无', trigger: 'change' }
        ],
        schoolhostname: [
          { required: true, message: '请在左侧选择学校举办者代码', trigger: 'change' }
        ],
      },
      typevalue: '',
      typeoptions: [],
      typenameoptions: [],
      hostvalue:'',
      hostoptions:[],
      hostnameoptions:[],
      locationtypevalue:'',
      locationtypeoptions:[],
      locationtypenameoptions:[],
      tlen:'',
      llen:'',
      hlen:''
    };
  },
  methods: {
    getTypeName(){
      this.ruleForm.schooltypename=this.typenameoptions[Math.abs(this.tlen-this.typevalue-1)].label
      this.ruleForm.schooltypecode=this.typeoptions[Math.abs(this.tlen-this.typevalue-1)].label

    },
    getLocationTypeName(){
      this.ruleForm.schoollocationtypename=this.locationtypenameoptions[Math.abs(this.llen-this.locationtypevalue-1)].label
      this.ruleForm.schoollocationtypecode=this.locationtypeoptions[Math.abs(this.llen-this.locationtypevalue-1)].label
    },
    getHostName(){
      this.ruleForm.schoolhostname=this.hostnameoptions[Math.abs(this.hlen-this.hostvalue-1)].label
      this.ruleForm.schoolhostcode=this.hostoptions[Math.abs(this.hlen-this.hostvalue-1)].label
    },
    submitForm(formName) {
      const _this=this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          axios.post("http://localhost:8081/school/save",this.ruleForm).then(function (res){
            console.log(res.data)
            if (res.data.msg==="添加成功"){
              _this.$message({
                message: '添加成功！',
                type: 'success'
                //添加成功后页面跳转
              });
              _this.$router.push('/SchoolList')
            }
            else{
              _this.$message({
                message: '学校名称重复！请重新输入',
                type: 'fail'
              });
            }
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  },
  created() {
    const _this=this
    let typelen=0
    let locationtypelen=0
    let hostlen=0
    const a=localStorage.getItem("access-admin")
    if (!a){
      this.$alert('未登录','提示',{
        confirmButtonText:'确定'
      }).then((res)=>{
        this.$router.replace({path:'/login'})
      })
    }
    else {
      axios.get("http://localhost:8081/schooltype/findAll").then(function (res){
        typelen=res.data.length;
        _this.tlen=res.data.length
        while(typelen){
          typelen--;
          _this.typeoptions.push({value:typelen,label:res.data[typelen].schooltypecode})
          _this.typenameoptions.push({value:typelen,label:res.data[typelen].schooltypename})
        }
      })
      axios.get("http://localhost:8081/schoollocationtype/findAll").then(function (res){
        locationtypelen=res.data.length;
        _this.llen=res.data.length;
        while(locationtypelen){
          locationtypelen--;
          _this.locationtypeoptions.push({value:locationtypelen,label:res.data[locationtypelen].schoollocationtypecode})
          _this.locationtypenameoptions.push({value:locationtypelen,label:res.data[locationtypelen].schoollocationtypename})
        }
      })
      axios.get("http://localhost:8081/schoolhost/findAll").then(function (res){
        hostlen=res.data.length;
        _this.hlen=res.data.length;
        while(hostlen){
          hostlen--;
          _this.hostoptions.push({value:hostlen,label:res.data[hostlen].schoolhostcode})
          _this.hostnameoptions.push({value:hostlen,label:res.data[hostlen].schoolhostname})
        }
      })
    }
  }
}
</script>
<style scoped>
.el-input,.el-select{
  width: 300px;
}

</style>
